<!-- 举报列表 -->
<template>
    <div class="page-box h100 display-flex czbj">
      <p class="title-label mb10">举报列表</p>
      <!-- sonRouter="yybureauFormationBJ" 为跳转新的页面编辑 -->
      <dxtable
        :dataJson="dataJson"
        :portUrl="portUrl"
        :formJson="formJson"
        :qx="qx"
       :isshowXz="false"
        ref="databale"
        :czFun="czFun"
      ></dxtable>



      <n-modal v-model:show="showModal" preset="card" class="Stock-diagnosis">
			<template #header>
				<div>审核</div>
			</template>
			<div>

				<n-tabs type="line" animated>
			



					<n-tab-pane name="帖子信息" tab="帖子信息">

						<div>
							<div>
								<div class="mt20 display-flex">
									<div class="flex-1">
										<div class="display-flex">
											<img :src="obj.headPortrait" class="xcxcfrtrxct" />
											<div class="flex-1 vertical-center tl ml20">{{ obj.name }}</div>
										</div>
									</div>
									<div class="flex-1 vertical-center tl">合作区域:{{ obj.quyu }}</div>
									<div class="flex-1 vertical-center tl">编号:{{ obj.id }}</div>
								</div>

								<div class="mt10" v-for="sd in jxcdfs">{{ sd.label }}:{{ xcfdf[sd.key] || "--" }}</div>

								<div class="display-flex mt10">
									<div class="">资源图片</div>
									<div class="ml20">
										<n-image v-for="(sd, idx) in imgList" :src="sd" class="mr20 dfdsfsdfxret" />
									</div>
								</div>
							</div>
							<div class="mt20 display-flex">
								<span class="red"> 审核：</span>
								<div>
									<n-radio-group v-model:value="xcxdfds" name="radiogroup">
										<n-space>
											<n-radio key="1" :value="1"> 通过 </n-radio>
											<n-radio key="21" :value="3"> 不通过 </n-radio>
										</n-space>
									</n-radio-group>
								</div>
							</div>

							<div class="tr btm pt20 mt20">
								<n-button type="primary" @click="tijjxcddrt"> 确定 </n-button>
								<n-button class="ml20" @click="showModal = false"> 关闭 </n-button>
							</div>

						</div>
					</n-tab-pane>
					<n-tab-pane name="用户信息" tab="用户信息">
						<div class="mt20 display-flex">
							<div class="flex-1">
								<div class="display-flex">
									<img :src="obj.headPortrait" class="xcxcfrtrxct" />
									<div class="flex-1 vertical-center tl ml20">{{ obj.name }}</div>
								</div>
							</div>
							<div class="flex-1 vertical-center tl">电话:{{ obj.bphone }}</div>
						</div>


						<div class="mt20 tl display-flex">
							<div class="vertical-center pt5">
								金币:
							</div>
							<div class="ml10">
								<n-input-number v-model:value="obj.balance" clearable @blur="zxczstetrt" />
							</div>
						</div>

					</n-tab-pane>
				</n-tabs>



			</div>


		</n-modal>
    </div>
  </template>
  <script lang="ts" setup>
  import dxtable from "../../components/util/dxtable.vue";
  import sort from "../../components/util/sort.vue";
  import { dxget, dxpost,transferTimeYMDHm } from "../../util/index";
  import { NButton, NImage, NTag } from "naive-ui";
  import { h, ref, reactive, render } from "vue";
  import { Options } from "@vicons/ionicons5";
  const databale = ref();
  const initeer = () => {
    databale.value.initDataExpose();
  };

  const showModal = ref()
  const kjxcdf = [
	{
		leixing: "1001",
		textData: [
			{
				label: "1.产品名称",
				iptlabel: "请填写产品、品牌名称(2-50字以内)",
				key: "dfdsfda"
			}, {
				label: "2.品牌关系",
				iptlabel: "我是该产品的品牌主、厂家、代理方、经销商、合作方供应链平台方等(2-50字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.需求渠道",
				iptlabel: "寻找直播带货、代理分销、电商商城、企业采购、商超零售等渠道合作(2-200字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.合作形式",
				iptlabel: "合作地区是否支持一件代发、是否有预算、分销代理等合作形式(2-200字以内)",
				key: "dfdsfdd"
			}, {
				label: "5.相关资质",
				iptlabel: "相关行业资质是否齐全，可填写获取的行业资质类型名称(2-200字以内)",
				key: "dfdsfde"
			}, {
				label: "6.优势介绍",
				iptlabel: "请填写产品品类、介绍、优势，产品价格范围、适用群体等详细介绍(10-1000字以内)",
				key: "dfdsfdf"
			}, {
				label: "7.其他补充(选填)",
				iptlabel: "有其他产品介绍可在此补充(0-2000字以内)",
				key: "dfdsfdg"
			},

		]
	},
	{
		leixing: "1002",
		textData: [
			{
				label: "1.渠道类型",
				iptlabel: "例:直播带货、MCN、自媒体、抖音快手、电商平台、零售商城等(2-50字以内)",
				key: "dfdsfda"

			}, {
				label: "2.品类要求",
				iptlabel: "例:全品类，或需求美妆个护、食品饮料、儿童母婴、快消品等(2-200字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.销货能力",
				iptlabel: "请填写日、周或月大概的带货能力，擅长哪些品类，过往销量等(2-200字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.收费介绍",
				iptlabel: "例:服务费+佣金、纯佣CPS、分销代理、平台保证金等收费模式(2-200字以内)",
				key: "dfdsfdd"
			}, {
				label: "5.结算说明",
				iptlabel: "请填写结算账期、结算周期(2-200字以内)",
				key: "dfdsfde"
			}, {
				label: "6.渠道优势",
				iptlabel: "请填写渠道详细介绍、渠道优势、销货情况、合作详情说明等(10-1000字以内)",
				key: "dfdsfdf"
			}, {
				label: "7.其他补充(选填)",
				iptlabel: "有渠道的其他介绍，或对产品的要求等可在此补充(0-2000字以内)",
				key: "dfdsfdg"
			},

		]
	}, {
		leixing: "1003",
		textData: [
			{
				label: "1.需求资源",
				iptlabel: "请填写需求的产品、服务、渠道、用户群体等资源(2-200字以内)",
				key: "dfdsfda"

			}, {
				label: "2.合作详情",
				iptlabel: "请填写合作的内容、方式、详情、介绍、要求等内容(2-200字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.费用预算",
				iptlabel: "大概的预算，及结算方式先付费、后付费、预付，结算周期等(2-200字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.其他补充(选填)",
				iptlabel: "有合作区域、合作要求等其他内容可在此补充(0-2000字以内)",
				key: "dfdsfdd"
			}

		]
	}, {
		leixing: "1004",
		textData: [
			{
				label: "1.提供资源",
				iptlabel: "请填写提供的产品、服务、渠道、用户群体等资源(2-200字以内)",
				key: "dfdsfda"
			}, {
				label: "2.优势介绍",
				iptlabel: "请填写公司、产品、服务、渠道等资源优势和介绍(2-200字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.需求资源",
				iptlabel: "请填写需要的合作，客户群体、类型或其他资源等(2-200字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.合作详情",
				iptlabel: "请填写合作的内容、方式、详情、介绍、要求等内容(2-200字以内)",
				key: "dfdsfdd"
			}, {
				label: "5.合作费用",
				iptlabel: "大概的费用，结算要求:先付费、后付费、预付等说明(2-200字以内)",
				key: "dfdsfde"
			}, {
				label: "6.其他补充(选填)",
				iptlabel: "有合作区域、合作要求等其他内容可在此补充(0-2000字以内)",
				key: "dfdsfdf"
			}

		]
	}, {
		leixing: "1005",
		textData: [
			{
				label: "1.项目名称",
				iptlabel: "请填写项目、产品名称(2-50字以内)",
				key: "dfdsfda"

			}, {
				label: "2.项目介绍",
				iptlabel: "请填写项目简介、优势、提供什么服务、解决什么问题，如何盈利等(10-1000字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.合作要求",
				iptlabel: "请填写项目适合哪些群体做、如何做、以及合作前准备合作要求等(2-200字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.收益利润",
				iptlabel: "请填写合作模式、项目收益构成、以及日、周、月或年收益利润范围(2-200字以内)",
				key: "dfdsfdd"
			}, {
				label: "5.费用说明",
				iptlabel: "请填写前后期有哪些费用，如:加盟费、保证金、服务费、材料费等(2-200字以内)",
				key: "dfdsfde"
			}, {
				label: "6.扶持培训",
				iptlabel: "请填写合作后提供哪些支持的政策、扶持、服务、培训、等帮助落地(2-200字以内)",
				key: "dfdsfdf"
			}, {
				label: "7.其他补充(选填)",
				iptlabel: "请填写合作区域、合作要求、公司项目介绍等更多内容可在此补充(0-2000字以内)",
				key: "dfdsfdg"
			},

		]
	}, {
		leixing: "1006",
		textData: [
			{
				label: "1.提供资源",
				iptlabel: "请填写提供的项目、产品、服务、流量、广告位等资源(10-1000字以内)",
				key: "dfdsfda"
			}, {
				label: "2.合作模式",
				iptlabel: "请填写合作模式，如:置换、赞助、联合活动、跨界等(2-200字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.需求资源",
				iptlabel: "请填写需求的用户群体、产品、服务、流量等合作资源(10-1000字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.其他补充(选填)",
				iptlabel: "有其他异业合作、线上线下广告置换、场地置换、优惠券虚拟置换等合作内容置换、联合活动、IP授权、实物置换、可在此补充(0-2000字以内)",
				key: "dfdsfdd"
			}

		]
	}, {
		leixing: "1007",
		textData: [
			{
				label: "1.项目名称",
				iptlabel: "请填写项目名称(2-50字以内)",
				key: "dfdsfda"
			}, {
				label: "2.佣金价格",
				iptlabel: "多少钱一单或佣金多少,也可以写价格范围(2-50字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.结算方式",
				iptlabel: "结算周期是预付、单结、日、周、月等(2-50字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.作业流程",
				iptlabel: "项目大概的操作流程，难易度或多少时间完成一单(2-200字以内)",
				key: "dfdsfdd"
			}, {
				label: "5.需求资源",
				iptlabel: "需要XX区域或地推、网推、工作室、大学生等渠道资源(2:200字以内)",
				key: "dfdsfde"
			}, {
				label: "6.其他补充(选填)",
				iptlabel: "有其他项目介绍、项目优势、合作要求等可在此补充，或有多个项目可以清空模板填写，或建议在这里简要补充其他项目(0-2000字以内)",
				key: "dfdsfdf"
			}

		]
	}, {
		leixing: "1008",
		textData: [
			{
				label: "1.推广渠道",
				iptlabel: "地推、网推渠道、工作室、电销团队、自媒体渠道、某行业资源等(2-50字以内)",
				key: "dfdsfda"
			}, {
				label: "2.推广地区",
				iptlabel: "全国不限地区或某些地区范围(2-50字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.推广优势",
				iptlabel: "有30人团队，有自媒体粉丝10万，有活跃社群1000个等介绍(2-200字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.承接项目",
				iptlabel: "承接B端项目，接上海区域地推项目，寻某些项目、资源合作等(2-200字以内)",
				key: "dfdsfdd"
			}, {
				label: "5.其他补充(选填)",
				iptlabel: "有其他渠道介绍优势补充，推广量级和承接项目要求等补充填写(0-2000字以以内)",
				key: "dfdsfde"
			}

		]
	}, {
		leixing: "1009",
		textData: [
			{
				label: "1.提供资源",
				iptlabel: "请填写提供的小区、写字楼、酒店、景区、商城等资源(10-1000字以内)",
				key: "dfdsfda"
			}, {
				label: "2.合作模式",
				iptlabel: "请填写合作模式，如:联合活动、租赁、置换、赞助等(2-200字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.需求资源",
				iptlabel: "请填写需求的用户群体、产品、活动、流量等合作资源(10-1000字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.其他补充(选填)",
				iptlabel: "有其他内容可在此补充(0-2000字以内)",
				key: "dfdsfdd"
			}

		]
	}, {
		leixing: "1010",
		textData: [
			{
				label: "1.合作介绍",
				iptlabel: "请填写公司、项目、产品、业务、服务等介绍(10-1000字以内)",
				key: "dfdsfda"
			}, {
				label: "2.我提供的资源",
				iptlabel: "请填写提供的项目、产品、业务、服务等资源(10-1000字以内)",
				key: "dfdsfdb"
			}, {
				label: "3.我需求的资源",
				iptlabel: "请填写需求的客户、合作和资源(10-1000字以内)",
				key: "dfdsfdc"
			}, {
				label: "4.其他详情补充(选填)",
				iptlabel: "有其他内容可在此补充(0-2000字以内)",
				key: "dfdsfdd"
			}

		]
	}
]
const xcxdfds = ref();
const jxcdfs = ref([])
const obj =ref({})
const xcfdf = ref({});
const imgList = ref([]);
  let kxcxct = [
    {
      label: "全部",
      value: "",
    },
    {
      label: "公告",
      value: 1,
    },
    {
      label: "系统消息",
      value: 2,
    },
  ];
  let dataJson = [
    {
      title: "帖子标题",
      key: "title",
    },
    {
      title: "举报原因",
      key: "yuanying",
    },
    {
      title: "补充说明",
      key: "bcsm",
    },
    {
      title: "截图",
      key: "jietu",
      val: [],
      render(row){
        const jnmxcx =[]
        if(row.jietu){
            row.jietu.split(",").map(a=>{
                jnmxcx.push(h(NImage, { src: a, class: "dsfsdrtrtrt imgjz mr10" }));
            })
        }
        return jnmxcx
        
      }
    },
    
    {
      title: "举报时间",
      key: "addTime",
      width: 150,
    },
  ];
  
  const qx = {
    DeletePermissionID: "xinxi100jubaodel", //删除
    EditPermissionIdentifier: "23456", // 编辑
    NewPermissionIdentifier: "xinxi100jubaoxz", // 新建
    ViewPermissionID: "xinxi100jubaock", // 查看
  };
  const portUrl = "xinxi100/jubao/jubao";
  
  let formJson = reactive([
    {
      title: "标题",
      type: "input",
      val: "",
      icon: "dx-shurukuang",
      span: 24,
      key: "title",
      width: "",
      search: true,
      istable: true,
      required: true,
    },
    {
      title: "内容",
      type: "textarea",
      val: "",
      icon: "dx-duohangwenben",
      span: 24,
      key: "text",
      width: "",
      search: false,
      istable: true,
      required: true,
    },
    {
      title: "类型",
      type: "radio",
      icon: "dx-radiobox",
      val: "1",
      opt: [
        {
          label: "公告",
          value: "1",
        },
        {
          label: "系统消息",
          value: "2",
        },
      ],
      span: 12,
      key: "type",
      width: null,
      search: true,
      istable: true,
      required: false,
    },
  ]);

  
  // 获取字典内容
  // const xtgxxmfl = async () => {
  //   const { data }: any = await dxget("dxgjAdmin/getzd", { name: 'xtgxxmfl' })
  //   dataJson[2].options = [
  //     {
  //       label: "全部",
  //       value: ""
  //     },
  //     ...data
  //   ]
  //   formJson[2].options = data
  //   xmlxSelect.value = data
  //   console.log(data);
  // }
  // xtgxxmfl()



  const kxcxdf = async (id) => {
	showModal.value = true;
	const { data } = await dxget("xinxi100/api/huoquxm", { id });
	console.log(data.leixing);

	kjxcdf.map(a => {
		if (data.leixing == a.leixing) {
			jxcdfs.value = a.textData
		}
	})


	obj.value = data;
	xcfdf.value = JSON.parse(data.xiangqing);
	imgList.value = JSON.parse(data.imgList);
};

const czFun = {
	fun: (row) => {
		return [
			h(
				NButton,
				{
					type: "info",
					quaternary: true,
					onClick: async (e) => {
						xcxdfds.value = row.zhuangtai;
						kxcxdf(row.tzid);
					},
				},
				"审核"
			),
		];
	},
};

const tijjxcddrt = async () => {
	await dxpost("xinxi100/xiangmu/xiangmu", { id: obj.value.id, zhuangtai: xcxdfds.value, shenhesj: transferTimeYMDHm() }, "put");
	showModal.value = false;
  initeer()
};
  </script>
  <style scoped></style>
  